var cite = "沧州";


/*天气*/

/*时间段*/
function b() {
    document.querySelector("#ul").innerHTML = "";
    document.querySelector("#ol").innerHTML = "";
    var xmlhttp;
    xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var json = JSON.parse(xmlhttp.responseText);
            console.log(json);

        /*一周的天气*/
            document.querySelector("#cnty").innerHTML = json.basic.cnty;

            //console.log(json);
            for(var i = 0;i < json.daily_forecast.length;i++){
                //console.log(2222)
                /*获取*/
                //console.log(json.daily_forecast[i]);
                /*创建h1*/
                var h1 = document.createElement("h1");
                h1.innerHTML = json.daily_forecast[i].date.slice(8,10) + "日";

                /*获取i标签*/
                var ii = document.createElement("i");
                ii.className = "png40 d01";
                var iii = document.createElement("i");
                iii.className = "png40 d01";
                /*获取天气*/
                var p1 = document.createElement("p");
                p1.className = "wea";
                p1.innerHTML = json.daily_forecast[i].cond.txt_d;
                /*获取温度*/
                var p2 = document.createElement("p");
                p2.className = "tem";
                /*span*/
                var span1 = document.createElement("span");
                span1.innerHTML = json.daily_forecast[i].tmp.max;
                var xie = document.createElement("i");
                xie.innerHTML = "/";
                var iiii = document.createElement("i");
                iiii.innerHTML = json.daily_forecast[i].tmp.min + "℃";
                p2.appendChild(span1);
                p2.appendChild(xie);
                p2.appendChild(iiii);
                /*风向*/
                var p3 = document.createElement("p");
                p3.className = "win";
                var em = document.createElement("em");
                em.className = "se";
                em.innerHTML = json.daily_forecast[i].wind.dir;
                var iiiii = document.createElement("i");
                var ji = document.createElement("span");
                ji.innerHTML = "级";

                if(json.daily_forecast[i].wind.sc != "1-2"){
                    iiiii.innerHTML = json.daily_forecast[i].wind.sc;
                }else {
                    json.daily_forecast[i].wind.sc = "<3";
                    iiiii.innerHTML = json.daily_forecast[i].wind.sc;
                }
                iiiii.appendChild(ji);
                p3.appendChild(em);
                p3.appendChild(iiiii);


                /*创建li*/
                var lie = document.createElement("li");
                lie.appendChild(h1);
                lie.appendChild(ii);
                lie.appendChild(iii);
                lie.appendChild(p1);
                lie.appendChild(p2);
                lie.appendChild(p3);
                document.querySelector("#ul").appendChild(lie);
            }



        /*一天8个时间段*/




            for(var j = 0;j < json.hourly_forecast.length;j++){
//console.log(1111111)
                /*创建em小时*/
                var emH = document.createElement("em");
                emH.innerHTML = json.hourly_forecast[j].date.slice(10,16)+"时";

                /*创建i img*/
                var d01 = document.createElement("i");
                d01.className = "png40 d01";

                /*创建wea*/
                var weni = document.createElement("p");
                weni.className = "wea";
                weni.innerHTML = json.hourly_forecast[j].tmp+"℃";

                /*创建win*/
                var wine = document.createElement("p");
                var wineEm = document.createElement("em");
                wineEm.className = "se";
                wineEm.innerHTML = json.hourly_forecast[j].wind.dir;
                var winei = document.createElement("i");
                if(json.hourly_forecast[j].wind.sc != "1-2"){
                    winei.innerHTML = json.hourly_forecast[j].wind.sc;
                }else {
                    json.hourly_forecast[j].wind.sc = "<3";
                    winei.innerHTML = json.hourly_forecast[j].wind.sc;
                }
                wine.appendChild(wineEm);
                wine.appendChild(winei);

                /*创建li标签*/
                var lil = document.createElement("li");
                lil.appendChild(emH);
                lil.appendChild(d01);
                lil.appendChild(weni);
                lil.appendChild(wine);
                document.querySelector("#ol").appendChild(lil);
            }


        /*每天的生活指数*/
            var spans1 = document.querySelector(".li1 span");
            spans1.innerHTML = json.suggestion.uv.brf;
            var ps1 = document.querySelector(".li1 p");
            ps1.innerHTML = json.suggestion.uv.txt;



            var spans2 = document.querySelector(".li2 span");
            spans2.innerHTML = json.suggestion.sport.brf;
            var ps2 = document.querySelector(".li2 p");
            ps2.innerHTML = json.suggestion.sport.txt;



            var spans3 = document.querySelector(".li3 span");
            spans3.innerHTML = json.suggestion.sport.brf;
            var ps3 = document.querySelector(".li3 p");
            ps3.innerHTML = json.suggestion.sport.txt;





            var spans4 = document.querySelector(".li4 span");
            spans4.innerHTML = json.suggestion.drsg.brf;
            var ps4 = document.querySelector(".li4 p");
            ps4.innerHTML = json.suggestion.drsg.txt;



            var spans5 = document.querySelector(".li5 span");
            spans5.innerHTML = json.suggestion.cw.brf;
            var ps5 = document.querySelector(".li5 p");
            ps5.innerHTML = json.suggestion.cw.txt;





            var spans6 = document.querySelector(".li6 span");
            spans6.innerHTML = json.suggestion.air.brf;
            var ps6 = document.querySelector(".li6 p");
            ps6.innerHTML = json.suggestion.air.txt;


        }
    };

    xmlhttp.open("GET", "https://bird.ioliu.cn/weather?city="+cite, true);
    xmlhttp.send();
}
b();




document.querySelector("#city").innerHTML = cite;
/*切换城市*/
document.querySelector("#iput").addEventListener("change",function(){
    document.querySelector("#city").innerHTML = this.value;
    cite = this.value;
    b();
});



